<script lang="ts" setup>
import SonDemo1 from '@/views/upLoadImg/sonDemo/sonDemo1.vue'
import SonDemo2 from '@/views/upLoadImg/sonDemo/sonDemo2.vue'
import SonDemo3 from '@/views/upLoadImg/sonDemo/sonDemo3.vue'
import SonDemo4 from '@/views/upLoadImg/sonDemo/sonDemo4.vue'
import SonDemo5 from '@/views/upLoadImg/sonDemo/sonDemo5.vue'
import SonDemo6 from '@/views/upLoadImg/sonDemo/sonDemo6.vue'
import SonDemo7 from '@/views/upLoadImg/sonDemo/sonDemo7.vue'
</script>

<template>
  <div class="body">
    <h1>饿了么ui文件上传案例</h1>

    <h3>基础用法</h3>
    <SonDemo1></SonDemo1>

    <h3>覆盖前一个文件</h3>
    <SonDemo2></SonDemo2>

    <h3>用户头像</h3>
    <SonDemo3></SonDemo3>

    <h3>照片墙</h3>
    <SonDemo4></SonDemo4>

    <h3>自定义缩略图</h3>
    <SonDemo5></SonDemo5>

    <h3>图片列表缩略图</h3>
    <SonDemo6></SonDemo6>

    <h3>拖拽上传</h3>
    <SonDemo7></SonDemo7>

    <h3>手动上传</h3>
  </div>
</template>

<style lang="scss" scoped>
.body {
  margin: 0 auto;
  border: solid 1px #1b9797;
}
</style>
